<template>
  <div class="layouts-wrapper">
    <!-- 头部区域 -->
    <div class="wrapper-header">
      <com-header></com-header>
    </div>

    <!-- 中间区域 -->
    <div class="wrapper-main">
      <router-view></router-view>
    </div>

    <!-- 底部区域 -->
    <div class="wrapper-footer">
      <com-footer></com-footer>
    </div>
  </div>
</template>

<script>
import comHeader from "@/components/comHeader/comHeader.vue";
import comFooter from "@/components/comFooter/comFooter.vue";
export default {
  //文件名
  name: "layouts",
  //注册组件
  components: {
    comHeader,
    comFooter,
  },
  data() {
    return {};
  },
  //生命周期
  mounted() {},
  //计算属性
  computed: {},
  //监听
  watch: {},
  methods: {},
};
</script>

<style lang="scss" scoped>
.layouts-wrapper {
  width: 100%;
  height: 100vh;

  .wrapper-header {
  }

  .wrapper-main {
    width: 100%;
  }

  .wrapper-footer{
 
  }
}
</style>
